<template>
    
    <!-- 首页container -->
    <el-container style="height: 100%">
    <el-aside width="auto">
        <!-- 侧边导航栏 -->
        <common-aside></common-aside>
    </el-aside>
    <el-container>
        <el-header>
            <common-header></common-header>
        </el-header>
        <el-main>
            <router-view></router-view>
        </el-main>
    </el-container>
    </el-container>

</template>

<script>

//  组件的引用
import CommonAside from '../src/components/CommonAside.vue';
import CommonHeader from '../src/components/CommonHeader.vue'

export default {
    name: 'Home',
    
    // 在这里引入组件
    components: {
        CommonAside,
        CommonHeader
    },
    data () {
        return {}
    }
}
</script>

<style lang="less" scoped>

// 设置顶部栏的容器
.el-header {
    background-color: #333;
}


// 将顶部的上内边距设置为0
.el-main {
    padding-top: 0;
}

</style>
